<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>延迟显示 HTML 元素</title>
</head>
<body>
<div id="change" class="change">
    <h1>Hello, World!</h1>
</div>

<script>
    let element = document.querySelector("#change");
    console.log(element);

    setTimeout(
        ()=>{
            // 创建一个 DOM 节点
            let inner = document.createElement("h1");
            inner.textContent = "Hello, Vue!"
            console.log(inner);

            // 添加到 DOM 树指定位置
            // element.append("<h1>Hello, Vue!</h1>")
            element.append(inner)
        },
        3000
    )
</script>
</body>
</html>